<template>
  <div class="search">
    <el-form ref="formInline" :inline="true" :model="formInline" class="demo-form-inline">
      <el-form-item :label="label">
        <el-input v-model="formInline.innerCode" clearable placeholder="请输入" />
      </el-form-item>

      <el-form-item v-if="showData" label="选择日期：">
        <el-date-picker
          v-model="selectData"
          type="daterange"
          range-separator="~"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
        />
      </el-form-item>

      <el-form-item>
        <el-button type="primary" icon="el-icon-search" class="searchBtn" style="padding:0;" @click="btnOK">查询</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  props: {
    label: {
      required: true,
      type: String
    },
    showData: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      formInline: {
        pageIndex: 1,
        pageSize: 10,
        innerCode: ''
      },
      selectData: ''
    }
  },
  methods: {
    btnOK() {
      this.$emit('searchInnerCode', this.formInline.innerCode)
    }
  }
}
</script>

<style>
  .search{
    background: #fff;
    height: 64px;
    margin-bottom: 20px;
  }
  .el-form-item__label{
    margin-left: 15px;
    font-weight: normal;
    line-height: 64px;
  }
  .el-form-item__content{
    line-height: 64px;
  }
  .el-input__inner{
    height: 36px;
  }
  .searchBtn{
    height: 36px;
    visibility:visible;
    width: 80px;
  }
</style>
